import util from '../other/util';
let verify = {};


// 单行文本输入框组件
verify.is = util.is;
var rules = util.rules;



var input = function (options) {
    if (options === undefined) {
        options = {};
    };
    // 合并参数
    this.options = $.extend({}, {
        verify: {
            text: '',
            rules: []
        },
        inputType: 'text',
        readonly: false,
        placeholder: '',
        'default': null,
        autocomplete: 'off',
        errorStyle: 'form-error',
        onChange: function () { },
        onError: function () { },
        onBlur: function () { },
        onReadonly: function () { },
    }, options);
    var _this = this;
    // 主要元素
    this.html = $('<input spellcheck="false" autocomplete="' + this.options.autocomplete + '" type="' + this.options.inputType + '" class="form-control" />');
    // 事件集合
    this.event = {
        change: this.options.onChange,
        error: this.options.onError,
        readonly: this.options.onReadonly,
    };
    // 绑定change方法(支持拼音输入法)
    this.html.unbind().bind('input propertychange', function () {
        _this.change();
    });

    this.html.blur(function () {
        _this.options.onBlur.apply(_this, [_this.html.val()]);
    });

    // 默认值
    this.value = null;
    // 兼容IE 的 placeHolder
    if (!!(this.options.placeholder) && !('placeholder' in document.createElement('input'))) {
        this.html.val(this.html.attr('placeholder', _this.options.placeholder));
        this.html.val(this.html.attr('placeholder')).addClass('ie-placeholder');
        this.html.bind('focus', function () {
            if (_this.html.val() == _this.html.attr('placeholder')) {
                _this.html.val("").removeClass('ie-placeholder');
            }
        }).bind('blur', function () {
            if (_this.html.val().length == 0) {
                _this.html.val(_this.html.attr('placeholder')).addClass('ie-placeholder');
            }
        });
    } else {
        this.html.attr('placeholder', this.options.placeholder);
    };
    // 初始化中,生成元素是否只读
    this.readonly(this.options.readonly);
    // 添加默认值
    this.set(this.options['default']);
    // 储存错误信息
    this.errorMessage = null;
    // 如果在 Form 对象中,则直接输出,不用Render(); 
};


// 绑定事件集合方法
input.prototype.on = function (str, event) {
    if (this.event.hasOwnProperty(str)) {
        this.event[str] = event;
    };
    return this;
};
input.prototype.showErrorStyle = function () {
    if (!this.options.errorStyle) {
        return this;
    };
    this.html.addClass(this.options.errorStyle);
    return this;
};
input.prototype.hideErrorStyle = function () {
    if (!this.options.errorStyle) {
        return this;
    };
    this.html.removeClass(this.options.errorStyle);
    return this;
};
// 单独绑定 change 方法
input.prototype.onChange = function (event) {
    this.event.change = event;
    return this;
};
// 单独绑定 error 方法
input.prototype.onError = function (event) {
    this.event.error = event;
    return this;
};
// 当值发生变化时
input.prototype.change = function () {
    // 改变变量作用域,使调用函数可以使用 this 方法
    this.value = this.html.val();
    this.event.change.apply(this, [this.html.val()]);
    // 执行验证方法
    this.verify();
    return this;
};
input.prototype.verify = function () {
    this.value = this.html.val();
    var text = rules(this.options.verify, this.html.val());
    // 如果错误信息不为空,则触发error方法,并保留错误信息
    if (text) {
        this.showErrorStyle();
        this.event.error.apply(this, [text, this.html.val()]);
        this.errorMessage = text;
    } else {
        this.hideErrorStyle();
        // 如果错误信息为空,侧清空错误信息
        this.errorMessage = null;
    };
    return this;
};
// 操作元素是否只读
input.prototype.readonly = function (isReadonly) {
    var _isReadonly = null;
    if (verify.is(isReadonly) == 'function') {
        _isReadonly = isReadonly();
    };
    _isReadonly = !!isReadonly;
    if (_isReadonly) {
        this.html.attr('readonly', 'readonly');
        this.html.addClass('readonly');
    } else {
        this.html.attr('readonly', _isReadonly);
        this.html.removeClass('readonly');
    };
    this.event.readonly.apply(this, [_isReadonly]);
    return this;
};
// 为输入框赋值
input.prototype.set = function (data, doChange) {
    if (data === null) {
        return;
    };
    this.value = data;
    this.html.val(data);
    if (doChange) {
        this.change();
    };
    return this;
};
// 取值方法
input.prototype.get = function (callBack, ignore) {
    if (ignore) {
        callBack(this.value);
    } else {
        this.verify();
        if (this.errorMessage) {
            callBack(this.errorMessage);
        } else {
            callBack(false, this.value);
        };
    };
    return this;
};

input.prototype.clear = function () {
    this.value = null;
    this.html.val(this.value);
};


export default input
